<template>
    <el-sub-menu :index="subMenuItem.menuListIndex">
        <template #title>
            <span>{{subMenuItem.menuListTitle}}</span>
        </template>
        <span v-for="item in subMenuList">
            <SubMenuListComponent v-if="item[subMenuField] && item[subMenuField].length > 0"
                                  :sub-menu-item="item" :sub-menu-list="item[subMenuField]" :sub-menu-field="subMenuField" :prop-json="propJson" :common-param="commonParam"/>
            <el-menu-item v-else :index="item.menuListIndex" @click="doMenuItemClick(item)">
                <span>{{item.menuListTitle}}</span>
            </el-menu-item>
        </span>
    </el-sub-menu>
</template>

<script name="SubMenuListComponent" setup lang="ts">
import {deepCopy} from "@/utils/ywuCommon";
import jsonpath from "jsonpath";
import {doThirdServiceAction} from "@/utils/lowcode/thirdService";
import {computed, defineProps} from "vue";

let props = defineProps(['subMenuItem', 'subMenuList', 'subMenuField', 'propJson', 'commonParam']);

let subMenuItem = computed(() => {return props['subMenuItem']})
let subMenuList = computed(() => {return props['subMenuList']})
let subMenuField = computed(() => {return props['subMenuField']})
let propJson = computed(() => {return props['propJson']})
let commonParam = computed(() => {return props['commonParam']})

function doClickExecThen(execParam) {

}

function doClickExecCatch(execParam) {

}

async function doMenuItemClick(item) {
    // 编辑模式不触发点击事件
    if (propJson.value.editFlag) {
        return
    }
    let innerParams = propJson.value.menuClickInnerRequestVariable
    let resList = deepCopy(propJson.value.clickAction)
    // 解析item字段
    let itemInnerInfo = "";
    if (innerParams[2].variableParamName) {
        itemInnerInfo = jsonpath.query(item, innerParams[2].variableParamName)
        if (itemInnerInfo && itemInnerInfo.length > 0) {
            itemInnerInfo = itemInnerInfo[0]
        } else {
            itemInnerInfo = "";
        }
    }
    for (let i = 0; i < resList.length; i++) {
        let action = resList[i]
        if (!action.apiParamList) {
            action.apiParamList = []
        }
        if (innerParams[0].variableName) {
            let menuIndexInfo = {variableName: innerParams[0].variableName, variableValue: item.menuListIndex, type: "custom", variableType: "String", variableParamName: ""}
            action.apiParamList.push(menuIndexInfo)
        }
        if (innerParams[1].variableName) {
            let menuTitle = {variableName: innerParams[1].variableName, variableValue: item.menuListTitle, type: "custom", variableType: "String", variableParamName: ""}
            action.apiParamList.push(menuTitle)
        }
        if (innerParams[2].variableName) {
            let itemInfo = {variableName: innerParams[2].variableName, variableValue: itemInnerInfo, type: "custom", variableType: "String", variableParamName: ""}
            action.apiParamList.push(itemInfo)
        }
    }
    // 定义一个标志位，后续同步执行
    let awaitObj = {flag: false, res: true}
    await doThirdServiceAction(resList, awaitObj, commonParam.value, doClickExecThen, doClickExecCatch, propJson.value);
}
</script>

<style scoped lang="less">

</style>